<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('表单配置')" />
    <th:block th:include="include :: select2-css" />
</head>
<body>
<div class="main-content">
    <form id="form-user-add" class="form-horizontal">
        <input name="deptId" type="hidden" id="treeId"/>
        <h4 class="form-header h4">基本信息</h4>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label is-required">标题：</label>
                    <div class="col-sm-8">
                        <input name="userName" placeholder="请输入标题信息" class="form-control" type="text" maxlength="30" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label">表单类型：</label>
                    <div class="col-sm-8">
                        <div class="input-group">
                            <select name="deptName" class="form-control m-b" >
                                <option value="01">单行文本框</option>
                                <option value="02">复选框</option>
                                <option value="03">单选框</option>
                                <option value="04">多行文本框</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label">默认值：</label>
                    <div class="col-sm-8">
                        <input name="defValue" placeholder="请输入默认值" class="form-control" type="text" maxlength="30" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label">行数：</label>
                    <div class="col-sm-8">
                        <div class="input-group">
                            <input id="email" name="email" class="form-control email" type="text" maxlength="50" placeholder="请输入邮箱">
                            <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <div class="form-group">
                    <label class="col-xs-2 control-label">备注：</label>
                    <div class="col-xs-10">
                        <textarea name="remark" maxlength="500" class="form-control" rows="3"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<div class="row">
    <div class="col-sm-offset-5 col-sm-10">
        <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存</button>&nbsp;
        <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
        <button type="button" class="btn btn-sm btn-danger" onclick="preview()"><i class="fa fa-reply-all"></i>预览 </button>
    </div>
</div>

<div class="row">
    <h2 style="text-align: center;font-weight: bold">郊区核酸采样分析</h2>
    <div class="row ibox" style="padding-bottom: 30px;width: 80%;margin: 30px auto">
        <form id="form-user-add2" class="form-horizontal" style="width: 60%;margin: 30px auto">
            <div class="col-sm-10">
            <h4>1) 活动地点</h4>
            <p>
                <input name="defValue" class="form-control" type="text" style="width: 700px;" required>
            </p>
            </div>

            <div class="col-sm-10">
            <h4>2) 参加人数</h4>
            <p>
                <input name="defValue" class="form-control" type="text" style="width: 100px;" value="30">
            </p>
            </div>
            <div class="col-sm-10">
                <h4>3) 性别</h4>
                    <label class="radio-inline"><input type="radio" checked="" value="option1" id="optionsRadios1" name="optionsRadios">男</label>
                    <label class="radio-inline"><input type="radio" value="option2" id="optionsRadios2" name="optionsRadios">女</label>
            </div>
            <br/>
            <div class="col-sm-10">
                <h4>4) 选择题</h4>
                <label class="checkbox-inline">
                    <input type="checkbox" value="option1" id="inlineCheckbox1">A.***</label>
                <label class="checkbox-inline">
                    <input type="checkbox" value="option1" id="inlineCheckbox2">B.***</label>
            </div>

        </form>
        <br/><br/>
    </div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: select2-js" />
<script>
    var prefix = ctx + "system/user";

    function submitHandler() {
        var chrtype = [[${#strings.defaultString(@config.getKey('sys.account.chrtype'), 0)}]];
        var password = $("#password").val();
        if ($.validate.form() && checkpwd(chrtype, password)) {
            var data = $("#form-user-add").serializeArray();
            var status = $("input[id='status']").is(':checked') == true ? 0 : 1;
            var roleIds = $.form.selectCheckeds("role");
            var postIds = $.form.selectSelects("post");
            data.push({"name": "status", "value": status});
            data.push({"name": "roleIds", "value": roleIds});
            data.push({"name": "postIds", "value": postIds});
            $.operate.saveTab(prefix + "/add", data);
        }
    }

    function preview() {
        var chrtype = [[${#strings.defaultString(@config.getKey('sys.account.chrtype'), 0)}]];
        var password = $("#password").val();
        if ($.validate.form() && checkpwd(chrtype, password)) {
            var data = $("#form-user-add").serializeArray();
            var status = $("input[id='status']").is(':checked') == true ? 0 : 1;
            var roleIds = $.form.selectCheckeds("role");
            var postIds = $.form.selectSelects("post");
            data.push({"name": "status", "value": status});
            data.push({"name": "roleIds", "value": roleIds});
            data.push({"name": "postIds", "value": postIds});
            $.operate.saveTab(prefix + "/add", data);
        }
    }

    /* 用户管理-新增-选择部门树 */
    function selectDeptTree() {
        var treeId = $("#treeId").val();
        var deptId = $.common.isEmpty(treeId) ? "100" : $("#treeId").val();
        var url = ctx + "system/dept/selectDeptTree/" + deptId;
        var options = {
            title: '选择部门',
            width: "380",
            url: url,
            callBack: doSubmit
        };
        $.modal.openOptions(options);
    }

    function doSubmit(index, layero){
        var tree = layero.find("iframe")[0].contentWindow.$._tree;
        var body = $.modal.getChildFrame(index);
        $("#treeId").val(body.find('#treeId').val());
        $("#treeName").val(body.find('#treeName').val());
        $.modal.close(index);
    }

    $(function() {
        $('#post').select2({
            placeholder: "请选择岗位",
            allowClear: true
        });
    })
</script>
</body>
</html>